import React, { PureComponent } from 'react';
import styled from 'styled-components';


const HYInput = styled.input.attrs({
  placeholder: 'codewhy',
  bColor: "red",
})`
  /* background-color: lightblue; */
  /* border-color: ${props => props.bColor}; */
  color: ${props => props.color};
`

class App extends PureComponent {
  constructor() {
    super();
    this.state = {
      color: "purple",
    }
  }

  render() {
    return (
      <div className="profile">

        <HYInput type="text" color={this.state.color} />

        <h2 className="title">我是Profile标题</h2>
        <div className="settings">
          <ul>
            <li>设置列表1</li>
            <li>设置列表2</li>
            <li>设置列表3</li>
          </ul>
        </div>

      </div>
    );
  }
}


export default App;